<html>
    <head>
        <script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
 <script src="js/jquery-1.7.1,min.js" type="text/javascript"></script>
<script src="js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
                //login window

                $(document).ready(function() {
	$('a.info').click(function() {

                //Getting the variable's value from a link
		var loginBox = $(this).attr('href');

		//Fade in the Popup
		$(loginBox).fadeIn(300);

		//Set the center alignment padding + border see css style
		var popMargTop = ($(loginBox).height() + 24) / 2;
		var popMargLeft = ($(loginBox).width() + 24) / 2;

		$(loginBox).css({
			'margin-top' : -popMargTop,
			'margin-left' : -popMargLeft
		});

		// Add the mask to body
		$('body').append('<div id="mask"></div>');
		$('#mask').fadeIn(300);

		return false;
	});

	// When clicking on the button close or the mask layer the popup closed
	$('a.close, #mask').live('click', function() {
	  $('#mask , .login-popup').fadeOut(300 , function() {
		$('#mask').remove();
	});
	return false;
	});
});
</script>
<style type="text/css">
    *{ margin:0; padding:0;  }
            #logo{ text-align:center; }
           .login-window{
    font-size:xx-large;
    font-family:cursive;
    font-style:italic;

    text-align:center;
    color:#000;

text-shadow:0 0 40px white ;



}
a:link {text-decoration:none;}    /* unvisited link */
a:visited {text-decoration:none;}
 #header{text-shadow:0 0 20px white ;text-align:center;color:#000;font-size:xx-large;font-weight:bolder;  top: 5%; left: 50%; background:url(bg-top.jpg)}
	 #mask {
	display: none;
	background: #000;
	position: fixed; left: 0; top: 0;
	z-index: 10;
	width: 100%; height: 100%;
	opacity:0.9;
	z-index: 999;
}

/* You can customize to your needs  */
.login-popup{
	display:none;
        background:#FFFFFF;
	padding: 20px;
	border: 5px solid #ddd;
	float: left;
	font-size: 1.2em;
	position: fixed;
	top: 50%;
        left: 50%;
	z-index: 99999;
	width:300px;
       color:#000;
       border-color:#080808;


}

#requestinfo{
    font: 116% 'Ariel',cursive;
    color:#00cccc;
    text-align: center;
}
#formrequest{
    background-color:#66cdcc ;
   -moz-border-radius: 15px;
   -webkit-border-radius: 15px;
   padding: 2px;
}
#content .btn_close{
    float:right;
    height:inherit;
    width:inherit;
    border:none;
    margin:0px;
   margin: -28px -28px 0 0;
}
    .button:hover { background:#000; }
</style>

    </head>

    <body>
        <br><br><br><br>

<!--        <a href="#login-box" class="login-window">Login Now</a>-->
       <div id="login-box" class="login-popup">
<a href="index.php" class="close"><img src="images/close1.png" class="btn_close" title="Close Window" alt="Close" /></a>
         <label for="request" id="requestinfo">&nbsp;&nbsp;Request More Information</label>
<form name="form" method="post">
 <table align="left" style="background-color: 414141">

  <tr>
   <td align="left">
    <input type="text" value="FirstName">
   </td>
  </tr>
  <tr>
   <td align="left">
    <input type="text" value="LastName">
   </td>
  </tr>
  <tr>
   <td align="left">
    <input type="text" value="Phone">
   </td>
  </tr>
  <tr>
   <td align="left">
    <input type="text" value="Email Address">
   </td>
  </tr>
  <tr>
   <td align="left">
    <textarea style="width: 155px;height: 50px">Comments</textarea>
   </td>
  </tr>
  <tr>
   <td align="left">
    <span id="formrequest"><a href="#"><b style="color: 414141">Submit Your Request</b></a></span>
   </td>
  </tr>
 </table>
</form>


       </div>

    </body>